<template>
    <div class="container-detail"  v-loading="loading" >
        <div class="wrapper-detail">
            <div class="detail-title">企业项目详情</div>
            <div style="text-align: right; padding: 5px 0">
                <el-button type="primary" @click="$router.go(-1)"
                >返回列表</el-button
                >
            </div>
            <div>
                <el-descriptions :title="currentProject.projName" direction="vertical" :column="4" border>
                    <el-descriptions-item label="项目名称">{{ currentProject.projName }}</el-descriptions-item>
                    <el-descriptions-item label="项目简介">{{ currentProject.projDesc }}</el-descriptions-item>
                    <el-descriptions-item label="利润（万元）" :span="2">{{ currentProject.profits }}</el-descriptions-item>
                    <el-descriptions-item label="日期">{{ currentProject.datetime }}</el-descriptions-item>
                    <el-descriptions-item label="项目状态">
                        <el-tag size="small">{{ currentProject.projStatus }}</el-tag>
                    </el-descriptions-item>
                    <el-descriptions-item label="项目地址">{{ currentProject.address }}</el-descriptions-item>
                </el-descriptions>
            </div>
        </div>
    </div>
</template>

<script>
import { apiGetProjectDetail } from '../../apis/index';

export default {
    name: 'Detail',
    data() {
        return {
            loading: true,
            currentProject: {},

        };
    },
    created() {},
    mounted() {
        this.getProjectDetail();

    },
    methods: {
        async getProjectDetail() {
            let res = await apiGetProjectDetail({ id: this.$route.query.id } );
            if (res.code === 0) {
                this.currentProject = res.data;
                this.loading = false;
            }
        }
    },
};
</script>

<style lang="scss" scoped>
.container-detail {
    padding: 0 5%;

    .wrapper-detail {
        text-align: left;
        border: 1px solid #42b983;
        padding: 10px 10%;

        .detail-title {
            font-size: 18px;
            margin: 16px 0;
        }
    }
}
</style>
